<template>
	<view class="forget">
		<view class="content margin-top">
			<!-- 主体 -->
			<view class="main margin-top">
				<view class="main-box" v-show="!isChecked">
					<view class="tips">服务器ip:</view>
					<wInput type="text" placeholder="请输入服务器IP"   v-model="ipselected"></wInput>
				</view>
				<view class="main-box" v-show="isChecked">
					<view class="tips">服务器ip:</view>
					<wInput type="password" placeholder="请输入服务器IP"   v-model="ipselected"></wInput>
				</view>
				<view class="main-box" v-show="!isChecked">
					<view class="tips">服务器端口:</view>
					<wInput type="text" maxlength="11" placeholder="请输入端口号"  v-model="portdselected"></wInput>
				</view>
				<view class="main-box" v-show="isChecked">
					<view class="tips">服务器端口:</view>
				<wInput type="password" maxlength="11" placeholder="请输入端口号"  v-model="portdselected"></wInput>
				</view>
				<view class="main-box">
					<view class="tips">标&ensp;&ensp;&ensp;&ensp;&ensp;识:</view>
					<wInput type="password" placeholder="请输入用户标识码"  v-model="userBs"></wInput>
				</view>
				<view class="remember" @tap="changeRememberPasswrod">
					<image class="remember-image" src="../../static/xuan.png" mode="aspectFill" v-if="agree"></image>
					<image class="remember-image" src="../../static/xuan2.png" mode="aspectFill" v-else></image>
					<text class="remember-text">是否使用讯华服务器端口设置</text>
				</view>
			</view>
			<wButton text="保存" :rotate="isRotate" @tap.native="startRePass()"></wButton>
		</view>
	</view>
</template>

<script>
	var _this;
	import wInput from '../../components/watch-login/watch-input.vue' //input
	import wButton from '../../components/watch-login/watch-button.vue' //button
	import * as Api from '@/syApis/syBb/apis.js'
	export default {
		data() {
			return {
				phoneData: "", //电话
				passData: "", //密码
				verCode: "", //验证码
				isRotate: false, //是否加载旋转
				ipselected: '',
				portdselected: '',
				userBs:"",
				agree: false,
				isChecked:false
			}
		},
		components: {
			wInput,
			wButton
		},
		mounted() {
			_this = this;
		},
		created() {
			this.ipselected = uni.getStorageSync('ip');
			this.portdselected = uni.getStorageSync('ipPost');
			this.userBs = uni.getStorageSync('UniqueNumber');
			this.isChecked = uni.getStorageSync('isChecked');
			if(this.isChecked){
				this.agree = true;
			}
		},
		methods: {
			changeRememberPasswrod() {
				this.agree = !this.agree;
				uni.setStorageSync("isChecked",this.agree);
				if(this.agree){
					this.ipselected = "192.168.1.51";
					this.portdselected = "9000";
					this.userBs = "1001";
					this.isChecked = true;
				}else{
					this.ipselected = "";
					this.portdselected = "";
					this.userBs = "";
					this.isChecked = false;
				}
			},
			startRePass() {
				if(this.ipselected==""){
					Api.showTip("ip地址不能为空");
					return;
				}else if(this.userBs==""){
					Api.showTip("用户标识不能为空");
				}else{
					uni.setStorageSync('ip',this.ipselected);
					uni.setStorageSync('ipPost',this.portdselected);
					uni.setStorageSync('UniqueNumber',this.userBs);
					var $this = this;
					let  data =  {
					   UniqueNumber : this.userBs
					}
					//let response = Api.settingUrl(data);
					Api.settingUrl(data,function(data){
						//连接成功
						if(data.state){
							if(data.data.TipsMsg == "OK"){
								try{
									uni.setStorageSync('DataBaseName', data.data.ResultMsg.DataBaseName);
								}catch(e){
									console.log(e);
								}
								Api.showTip("连接成功");
								uni.navigateBack({
									delta:1
								})
													  
							}else if(data.data.ErrorMsg != ""){
								Api.showTip(data.data.ErrorMsg);
							}
						}else{
							Api.showTip("服务器开小差了");
						}
					});
                }		
			}
		}
	}
</script>
    export default{
		data(){
			
		},
		methods:{
			
		}
	}
<style>
	@import url("../../components/watch-login/css/icon.css");
	@import url("./css/main.css");

	.bg1 {
		background-color: rgba(33, 167, 191, 0.8);
		color: #FFFFFF;
	}

	.main-box {
		display: flex;
	}

	.oBorder {
		border: 1rpx #E1D7F0 solid;
	}

	/*新加*/
	.main-list {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		height: 36upx;
		/* Input 高度 */
		color: #333333;
		padding: 32upx 32upx 32upx 10upx;
		margin-top: 24upx;
		margin-bottom: 24upx;
	}

	.main-list1 {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		height: 36upx;
		/* Input 高度 */
		color: #333333;
		padding: 32upx 0 32upx 10upx;
		margin-top: 24upx;
		margin-bottom: 24upx;
	}

	.img {
		width: 32upx;
		height: 32upx;
		font-size: 32upx;
	}

	.main-input {
		flex: 1;
		text-align: left;
		font-size: 28upx;
		/* line-height: 100upx; */
		padding-right: 10upx;
		margin-left: 20upx;
	}

	.vercode {
		color: rgba(0, 0, 0, 0.7);
		font-size: 24upx;
		line-height: 100upx;
	}

	.vercode-run {
		color: rgba(0, 0, 0, 0.4) !important;
	}

	.oBorder {
		width: 75%;
		border: 1rpx #E1D7F0 solid;
		border-radius: 2.5rem;
		-webkit-box-shadow: 0 0 60upx 0 rgba(43, 86, 112, .1);
		box-shadow: 0 0 60upx 0 rgba(43, 86, 112, .1);
	}

	.stop {
		background-color: rgb(96, 188, 204);
	}

	/*历史连接*/
	.ls-box {
		font-size: 16px;
		padding: 5px 0;
		border-bottom: 1rpx #E1D7F0 solid;
		color: #24292E;
	}

	.bg-ls {
		background-color: rgba(33, 167, 191, 1);
		position: fixed;
		width: inherit;
		height: 50px;
		z-index: 100;
	}

	.ls-main {
		max-height: 70%;
	}

	.ls-contain {
		padding-top: 50px;
		height: inherit;
	}
	.remember{
		    /* justify-content: center; */
		    margin-left: 5px;
		    -webkit-box-orient: horizontal;
		    -webkit-box-direction: normal;
		    -webkit-flex-direction: row;
		    -ms-flex-direction: row;
		    flex-direction: row;
		    -webkit-box-align: center;
		    -webkit-align-items: center;
		    -ms-flex-align: center;
		    align-items: center;
		    display: -webkit-box;
		    display: -webkit-flex;
		    display: -ms-flexbox;
		    display: flex;
	}
	.remember-image{
		width: 23px;
		height: 23px;
		margin: 5px;
		display: inline-block;
	}
</style>
